<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html"; charset="UTF-8">
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <title>省市联动</title>
    <script type="text/javascript">
        $(function () {
            //省的之发生变化的时候， 触发这个方法
            $("#province").change(function () {
                //获取省的value值，用于判断
                var province = $("#province").val();
                if(province == 1){
                    //省份选择北京市
                    var htmlStr = "<option value=\"0\">---------请选择城市----------</option>"
                                +"<option value=\"1\">---------东城区----------</option>"
                                +"<option value=\"2\">---------西城区----------</option>"
                                +"<option value=\"3\">---------昌平区----------</option>"
                                +"<option value=\"3\">---------海淀区----------</option>"
                        $("#city").html(htmlStr);

                }
                if(province == 2){
                    //省份选择辽宁省
                    var htmlStr = "<option value=\"0\">---------请选择城市----------</option>"
                        +"<option value=\"1\">---------抚顺市----------</option>"
                        +"<option value=\"2\">---------沈阳市----------</option>"
                        +"<option value=\"3\">---------大连区----------</option>"
                        +"<option value=\"3\">---------鞍山区----------</option>"
                    $("#city").html(htmlStr);
                }
                if(province == 3){
                    //省份选择河北省
                    var htmlStr = "<option value=\"0\">---------请选择城市----------</option>"
                        +"<option value=\"1\">---------保定市----------</option>"
                        +"<option value=\"2\">---------邢台市----------</option>"
                        +"<option value=\"3\">---------石家庄市----------</option>"
                        +"<option value=\"3\">---------唐山市----------</option>"
                    $("#city").html(htmlStr);
                }
            });
        });
    </script>
</head>
<body>
    <table border="1" width="800px">
        <tr>
            <td>省：
                <select id="province">
                    <option value="0">-------请选择省份---------</option>
                    <option value="1">-------北京市---------</option>
                    <option value="2">-------辽宁省---------</option>
                    <option value="3">-------河北省---------</option>
                </select>
            </td>
            <td>市：
                <select id="city">
                    <option value="0">---------请选择城市----------</option>


                </select>
            </td>
        </tr>

    </table>
</body>
</html>